﻿@{
    Layout = null;

    var roxy = "~/lib/roxyfm/";
}

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Roxy File Manager</title>
    <script>
         var roxy_root = '@Url.Content("~/admin/roxyfilemanager/")';
         var roxy_assets_root = '@Url.Content(roxy)';
    </script>

    <zone name="stylesheets">
        <link rel="stylesheet" href="~/lib/fa6/css/all.min.css" />
        <link rel="stylesheet" href="~/bundle/css/admin-theme.css" />
        <link rel="stylesheet" href="~/lib/roxyfm/css/jquery-ui-1.10.4.custom.min.css" />
        <link rel="stylesheet" href="~/bundle/css/roxyfm.css" />
    </zone>

    <zone name="head_scripts"></zone>
</head>
<body>
    <table cellpadding="0" cellspacing="0" id="wraper">
        <tr>
            <td valign="top" class="pnlDirs" id="dirActions">
                <div class="actions d-flex p-2">
                    <button type="button" class="btn btn-sm btn-light" id="btnAddDir" title="Create new directory" onclick="addDir()" data-lang-v="CreateDir" data-lang-t="T_CreateDir">
                        <i class="fa fa-plus"></i>
                        <span>Create</span>
                    </button>

                    <button type="button" class="btn btn-sm btn-light btn-icon ml-auto" id="btnRenameDir" title="Rename directory" onclick="renameDir()" data-lang-v="RenameDir" data-lang-t="T_RenameDir">
                        <i class="fa fa-pencil-alt"></i>
                        <span class="d-none">Rename</span>
                    </button>
                    <button type="button" class="btn btn-sm btn-light btn-to-danger btn-icon" id="btnDeleteDir" title="Delete selected directory" onclick="deleteDir()" data-lang-v="DeleteDir" data-lang-t="T_DeleteDir">
                        <i class="far fa-trash-alt"></i>
                        <span class="d-none">Delete</span>
                    </button>
                </div>
                <div id="pnlLoadingDirs" class="p-3">
                    <div>Loading directories...</div>
                    <img src="~/lib/roxyfm/images/loading.gif" title="Loading directory tree, please wait..." />
                </div>
                <div class="scrollPane">
                    <ul id="pnlDirList" class="mt-2 clearfix"></ul>
                </div>
            </td>
            <td valign="top" id="fileActions">
                <input type="hidden" id="hdViewType" value="list">
                <input type="hidden" id="hdOrder" value="asc">
                <div class="actions d-flex flex-wrap p-2">
                    <div class="btn-group">
                        <button type="button" class="btn btn-sm btn-light" id="btnAddFile" title="Upload files" onclick="addFileClick()" data-lang-v="AddFile" data-lang-t="T_AddFile">
                            <i class="fa fa-plus"></i>
                            <span class="d-none d-lg-inline">Add file</span>
                        </button>
                    </div>
                    <div class="btn-group d-none d-xl-inline-flex">
                        <button type="button" class="btn btn-sm btn-light btn-icon" id="btnPreviewFile" title="Preview selected file" onclick="previewFile()" data-lang-v="Preview" data-lang-t="T_Preview">
                            <i class="far fa-eye"></i>
                            <span class="d-none">Preview</span>
                        </button>
                        <button type="button" class="btn btn-sm btn-light btn-icon" id="btnRenameFile" title="Rename selected file" onclick="renameFile()" data-lang-v="RenameFile" data-lang-t="T_RenameFile">
                            <i class="fa fa-pencil-alt"></i>
                            <span class="d-none">Rename</span>
                        </button>
                        <button type="button" class="btn btn-sm btn-light btn-icon" id="btnDownloadFile" title="Download selected file" onclick="downloadFile()" data-lang-v="DownloadFile" data-lang-t="T_DownloadFile">
                            <i class="fa fa-download"></i>
                            <span class="d-none">Download</span>
                        </button>
                        <button type="button" class="btn btn-sm btn-light btn-icon btn-to-danger" id="btnDeleteFile" title="Delete selected file" onclick="deleteFile()" data-lang-v="DeleteFile" data-lang-t="T_DeleteFile">
                            <i class="far fa-trash-alt"></i>
                            <span class="d-none">Delete</span>
                        </button>
                    </div>
                    <div class="btn-group border-right-0">
                        <button type="button" class="btn btn-sm btn-light btn-icon btn-view" id="btnListView" title="List view" onclick="switchView('list')" data-lang-t="T_ListView">
                            <i class="fa fa-list"></i>
                            <span class="d-none">List view</span>
                        </button>
                        <button type="button" class="btn btn-sm btn-light btn-icon btn-view" id="btnThumbView" title="Thumbnails view" onclick="switchView('thumb')" data-lang-t="T_ThumbsView">
                            <i class="fa fa-th"></i>
                            <span class="d-none">Thumbnails view</span>
                        </button>
                    </div>
                    <div class="sort-filter form-inline btn-group border-right-0">
                        <select id="ddlOrder" class="form-control form-control-sm mr-1" onchange="sortFiles()">
                            <option value="name" data-lang="Name_asc">&uarr;&nbsp;&nbsp;Name</option>
                            <option value="size" data-lang="Size_asc">&uarr;&nbsp;&nbsp;Size</option>
                            <option value="time" data-lang="Date_asc">&uarr;&nbsp;&nbsp;Date</option>
                            <option value="name_desc" data-lang="Name_desc">&darr;&nbsp;&nbsp;Name</option>
                            <option value="size_desc" data-lang="Size_desc">&darr;&nbsp;&nbsp;Size</option>
                            <option value="time_desc" data-lang="Date_desc">&darr;&nbsp;&nbsp;Date</option>
                        </select>

                        <input type="text" class="form-control form-control-sm d-none d-lg-inline-block" placeholder="@Html.Raw(T("Common.Search") + "...")" id="txtSearch" onkeyup="filterFiles()" onchange="filterFiles()" />
                    </div>
                    <div class="btn-group">
                        <button type="button" class="btn btn-sm btn-light btn-to-primary" id="btnSelectFile" title="Select highlighted file" onclick="setFile()" data-lang-v="SelectFile" data-lang-t="T_SelectFile">
                            <i class="fa fa-check"></i>
                            <span>Select</span>
                        </button>
                    </div>
                </div>
                <div class="pnlFiles">
                    <div class="scrollPane">
                        <div id="pnlLoading" class="p-2">
                            <div class="text-muted" data-lang="LoadingFiles">Loading files...</div>
                            <div class="progress mt-2" style="width: 200px">
                                <div class="progress-bar bg-warning progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%"></div>
                            </div>
                        </div>
                        <div id="pnlEmptyDir" class="p-2 text-muted" data-lang="DirIsEmpty">
                            This folder is empty
                        </div>
                        <div id="pnlSearchNoFiles" class="text-muted p-2" data-lang="NoFilesFound">
                            No files found
                        </div>
                        <ul id="pnlFileList" class="clearfix"></ul>
                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td class="bottomLine">
                &nbsp;&nbsp;&nbsp;<a href="http://www.roxyfileman.com" target="_blank">&copy; 2013 - <span id="copyYear"></span> RoxyFileman</a>
            </td>
            <td class="bottomLine">
                <div id="pnlStatus">Status bar</div>
            </td>
        </tr>
    </table>
    <!-- Forms and other components -->
    <iframe name="frmUploadFile" width="0" height="0" style="display:none;border:0;"></iframe>
    <div id="dlgAddFile">
        <form name="addfile" id="frmUpload" method="post" target="frmUploadFile" enctype="multipart/form-data">
            <input type="hidden" name="d" id="hdDir" />
            <div class="form">
                <br />
                <input class="mb-2" type="file" name="files[]" id="fileUploads" onchange="listUploadFiles(this.files)" multiple="multiple" />
                <div id="uploadResult"></div>
                <div class="uploadFilesList">
                    <div id="uploadFilesList"></div>
                </div>
            </div>
        </form>
    </div>
    <div id="menuFile" class="dropdown-menu">
        <a href="#" class="dropdown-item" onclick="setFile()" data-lang="SelectFile" id="mnuSelectFile">
            <i class="fa fa-fw fa-check"></i>
            <span>Select</span>
        </a>
        <a href="#" class="dropdown-item" onclick="previewFile()" data-lang="Preview" id="mnuPreview">
            <i class="far fa-fw fa-eye"></i>
            <span>Preview</span>
        </a>
        <a href="#" class="dropdown-item" onclick="downloadFile()" data-lang="DownloadFile" id="mnuDownload">
            <i class="fa fa-fw fa-download"></i>
            <span>Download</span>
        </a>
        <div class="dropdown-divider"></div>
        <a href="#" class="dropdown-item" onclick="cutFile()" data-lang="Cut" id="mnuFileCut">
            <i class="fa fa-fw fa-cut"></i>
            <span>Cut</span>
        </a>
        <a href="#" class="dropdown-item" onclick="copyFile()" data-lang="Copy" id="mnuFileCopy">
            <i class="fa fa-fw fa-copy"></i>
            <span>Copy</span>
        </a>
        <a href="#" class="dropdown-item paste disabled" onclick="return pasteToFiles(event, this)" data-lang="Paste" id="mnuFilePaste">
            <i class="far fa-fw fa-clipboard"></i>
            <span>Paste</span>
        </a>
        <div class="dropdown-divider"></div>
        <a href="#" class="dropdown-item" onclick="renameFile()" data-lang="RenameFile" id="mnuRenameFile">
            <i class="fas fa-fw fa-pencil-alt"></i>
            <span>Rename</span>
        </a>
        <a href="#" class="dropdown-item" onclick="deleteFile()" data-lang="DeleteFile" id="mnuDeleteFile">
            <i class="far fa-fw fa-trash-alt"></i>
            <span>Delete</span>
        </a>
    </div>
    <div id="menuDir" class="dropdown-menu">
        <a href="#" class="dropdown-item" onclick="addDir()" data-lang="T_CreateDir" id="mnuCreateDir">
            <i class="fa fa-fw fa-plus"></i>
            <span>Create new</span>
        </a>
        <a href="#" class="dropdown-item" onclick="downloadDir()" data-lang="Download" id="mnuDownloadDir">
            <i class="fa fa-fw fa-download"></i>
            <span>Download</span>
        </a>
        <div class="dropdown-divider"></div>
        <a href="#" class="dropdown-item" onclick="cutDir()" data-lang="Cut" id="mnuDirCut">
            <i class="fa fa-fw fa-cut"></i>
            <span>Cut</span>
        </a>
        <a href="#" class="dropdown-item" onclick="copyDir()" data-lang="Copy" id="mnuDirCopy">
            <i class="fa fa-fw fa-copy"></i>
            <span>Copy</span>
        </a>
        <a href="#" class="dropdown-item paste disabled" onclick="return pasteToDirs(event, this)" data-lang="Paste" id="mnuDirPaste">
            <i class="far fa-fw fa-clipboard"></i>
            <span>Paste</span>
        </a>
        <div class="dropdown-divider"></div>
        <a href="#" class="dropdown-item" onclick="renameDir()" data-lang="RenameDir" id="mnuRenameDir">
            <i class="fa fa-fw fa-pencil-alt"></i>
            <span>Rename</span>
        </a>
        <a href="#" class="dropdown-item" onclick="deleteDir()" data-lang="DeleteDir" id="mnuDeleteDir">
            <i class="far fa-fw fa-trash-alt"></i>
            <span>Delete</span>
        </a>
    </div>
    <div id="pnlRenameFile" class="dialog">
        <span class="name"></span><br>
        <input type="text" id="txtFileName" class="form-control">
    </div>
    <div id="pnlDirName" class="dialog">
        <span class="name"></span><br>
        <input type="text" id="txtDirName" class="form-control">
    </div>

    <zone name="scripts">
        <script src="~/bundle/js/roxyfm.js"></script>
        <script src="~/lib/roxyfm/lang/{lang}.js" charset="utf-8" sm-locale-for="WorkContext.WorkingLanguage"></script>
    </zone>

</body>
</html>